<script setup lang="ts">
import type { ChannelItem } from '@/types';



defineProps<{
    channels: ChannelItem[],
    activeId: number
}>()

// 子传父, 当前点击的id
// 在a标签中使用emits 调用
const emits = defineEmits<{
    "updateActiveId": [activeId: number]
}>()

</script>

<template>
  <div class="channel-nav">
    <nav class="list">
      <a
      @click="emits('updateActiveId', item.id)"
        class="item"
         :class="{ active: item.id === activeId }"
        href="javascript:;"
        v-for="(item, i) in channels"
        :key="item.id"
      >
      {{ item.name }}
      </a>
    </nav>
  </div>
</template>